<template>
  <van-popup
    v-model="isShow"
    closeable
    round
    position="bottom"
    class="popup-appoint"
  >
    <div class="hd">
      <h3>选择预约时间段({{ row.schedulingYear }})</h3>
    </div>
    <div class="bd" v-for="(time,i) in list" :key="i">
      <div class="title">{{time.schedulingName + '号源'}}</div>
      <van-row>
          <van-col span="8" v-for="(item,index) in time.list" :key="index" @click="selectTime(item, time.schedulingId)">
            <van-tag plain :type="item.disabled ? 'default' : 'primary'" size="medium" round>{{item.name}}</van-tag>
          </van-col>
      </van-row>
    </div>
  </van-popup>
</template>
<script>
import moment from 'moment';
export default {
  data(){
    return {
      isShow: false,
      active: 0,
      row: {},
      list:[]
    }
  },
  methods:{
    init(row){
      this.row = row;
      this.getList();
      this.isShow = true;
    },
    getList(){
      let currentDay = moment().format('YYYY-MM-DD');
      let currentHour = new Date().getHours();
      let list = [];
      this.row.times.forEach(item => {
        let startTime = Number(item.startTime.substring(0,2));
        let endTime = Number(item.endTime.substring(0,2));
        let arr = [];
        if(this.row.schedulingYear == currentDay){
          if(endTime > currentHour){
            let start = startTime > currentHour ? startTime : currentHour;
            this.getTimeArr(start, endTime, arr);
          }
        }else{        
          this.getTimeArr(startTime, endTime, arr);
        }
        if(arr.length > 0){
          list.push({
            schedulingType: item.schedulingType,
            schedulingId: item.schedulingId,
            schedulingName: this.getSchedulingName(item.schedulingType),
            list: arr,
          });
        }
      });
      console.log(list);
      this.list = list;
      
    },
    getSchedulingName(type){
      let name = '';
      switch(type){
        case '0':
          name = '上午';
          break;
        case '1':
          name = '下午';
          break;
        case '2':
          name = '晚上';
          break;
      }
      return name;
    },
    getTimeArr(start,end,arr){
      let day = moment().format('YYYY-MM-DD');
      for(let i = start; i < end; i++){
          // 判断当天时间是否已超过xx:30:00;
          if(this.row.schedulingYear == day && new Date().getTime() > new Date(day + ' ' + this.getTwoDigits(i)+':30:00').getTime()){
            arr.push({id: this.getTwoDigits(i)+':30:00', name: this.getTwoDigits(i)+':30~'+this.getTwoDigits(i+1)+":00"}); 
          }else{
            arr.push({id: this.getTwoDigits(i)+':00:00', name: this.getTwoDigits(i)+':00~'+this.getTwoDigits(i)+':30', disabled: false});
            arr.push({id: this.getTwoDigits(i)+':30:00', name: this.getTwoDigits(i)+':30~'+this.getTwoDigits(i+1)+":00", disabled: false});  
          }
      }
    },
    getTwoDigits(i){
      let val = i;
      if(i < 10){
        val = '0'+i;
      };
      return val;
    },
    selectTime(item, schedulingId){
      // this.$util.gotoPage('/appointment/detail', {id: 0, from: 'home'});
      if(item.disabled){
        this.$toast('不能预约该时段');
        return;
      }
      this.$emit('confirm', {...item,schedulingYear: this.row.schedulingYear, schedulingId: schedulingId});
      this.isShow = false;
    }
  }
}
</script>